<template>

  <div v-show="logic.isdisable==true">
     <el-form :inline="true" :model="form" class="demo-form-inline">
    <el-form-item label="编码">
      <el-input v-model="form.ExamineNo" clearable @change="GetType"/>
    </el-form-item>
    <el-form-item label="名称">
      <el-input v-model="form.ExamineName"  clearable  @change="GetType"/>
    </el-form-item>
  
    
  </el-form>
  </div>
    <div style="margin-left: 1080px;">
       <el-form>
        <el-form-item>
            <el-button type="success" @click="Open(null)">新增</el-button>

            <el-button type="warning" @click="GetOpen(false)">查询</el-button>
      
            <!-- <el-button type="primary">导出</el-button> -->
            <el-button  :disabled="logic.isShow==false" type="danger" @click="AllDelete">删除</el-button>
        </el-form-item>
    </el-form>
    </div>
   
  <el-table
    ref="multipleTable"
    :data="tableData"
    tooltip-effect="dark"
    style="width: 100%"
    @selection-change="handleSelectionChange">
    
    <el-table-column type="selection" width="55">
    </el-table-column>
     <el-table-column type="index" width="55" label="序号" />

    <el-table-column prop="examineNo" label="编码" width="180">
    </el-table-column>
    <el-table-column prop="examineName" label="名称" width="180">
    </el-table-column>
    <el-table-column prop="examineDesc"label="描述" width="180">
    </el-table-column>
    <el-table-column prop="createName"label="创建人" width="180">
    </el-table-column>
      <el-table-column prop="createTime"label="创建时间" >
    <template v-slot="scope">{{scope.row.createTime.substring(0,19).replace("T"," ") }}</template>
      </el-table-column>
      <el-table-column label="操作" width="180">
        <template v-slot="scope">
          <el-tag style="color:green" @click="Open(scope.row)">编辑</el-tag>
          <el-tag style="color: red;" @click="Delete(scope.row)">删除</el-tag>
        </template>
    </el-table-column>
  </el-table>
  <div style="margin-left: 1010px;">
   <el-pagination
      v-model:current-page="paing.PageIndex"
      v-model:page-size="paing.PageSize"
      :page-sizes="[10,20,30,40]"
      :background="true"
      layout="total, prev, pager, next,sizes, jumper"
      :total="paing.totalCount"
    
    />
</div>

    <el-dialog v-model="logic.isOpen" :title="logic.isTitle" width="500" align-center draggable>
    <el-form :model="model" :label-width="120">
      <el-form-item label="编码" >
        <el-input v-model="model.examineNo" autocomplete="off" />
      </el-form-item>
      <el-form-item label="名称" >
        <el-input v-model="model.examineName" autocomplete="off" />
      </el-form-item>
      <el-form-item label="描述" >
        <el-input type="textarea" v-model="model.examineDesc" autocomplete="off" />
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="logic.isOpen = false">取消</el-button>
        <el-button type="primary" @click="save">
          保存
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script lang="ts" setup>
import { ref,reactive,onMounted, watch } from 'vue'
import axios from 'axios'
import { type TableInstance,ElMessage,ElMessageBox } from 'element-plus'
import { APIs } from '@/Http/http'
//生命周期函数钩
onMounted(()=>{
GetType();
})


interface User {
  id: number
  date: string
  name: string
  address: string
}


const multipleTableRef = ref<TableInstance>()
const listrow = ref<any[]>([])

const selectable = (row: User) => ![1, 2].includes(row.id)
const toggleSelection = (rows?: User[], ignoreSelectable?: boolean) => {
  if (rows) {
    rows.forEach((row) => {
      multipleTableRef.value!.toggleRowSelection(
        row,
        undefined,
        ignoreSelectable
      )
    })
  } else {
    multipleTableRef.value!.clearSelection()
  }
}
const handleSelectionChange = (val: any[]) => {

 
 listrow.value=val;
    logic.isShow=true;


 
 
}

//逻辑对象
const logic=reactive({
    isShow:false,
    isOpen:false,
    isTitle:"",
    isAdd:false,
    isdisable:false
})

//参数变量
const model=reactive({
  examineId:0,
  examineNo: "",
  examineName: "",
  examineDesc: ""

})
const Open=(row:any)=>{
  logic.isOpen=true;
  if(row==null)
{
  logic.isAdd=true;
  logic.isTitle="新增"
  model.examineId=0,
  model.examineNo="";
  model.examineName="";
  model.examineDesc=""
}
else
{
  logic.isAdd=false;
  logic.isTitle="修改";
  model.examineId=row.examineId
  model.examineNo=row.examineNo
  model.examineName=row.examineName
  model.examineDesc=row.examineDesc
}

}
const save=()=>{



  if(logic.isAdd)
{
  if(model.examineNo=="")
{
ElMessage.error("编码不能为空")
return;
}
  if(model.examineName=="")
{
ElMessage.error("名称不能为空")
return;
}
 APIs.post("/api/Write/AddExamineType",model).then(res=>{
  if(res.data.code==100)
 {
     ElMessage.success(res.data.msg);
       logic.isOpen=false;
       GetType();
 }
 else
 {
  ElMessage.error(res.data.msg);
  return;
 }
 })
}
else
{
  if(model.examineNo=="")
{
ElMessage.error("编码不能为空")
return;
}
  if(model.examineName=="")
{
ElMessage.error("名称不能为空")
return;
}
   APIs.post("/api/Write/UpdateType",model).then(res=>{
  if(res.data.code==100)
 {
     ElMessage.success(res.data.msg);
       logic.isOpen=false;
       GetType();
 }
 else
 {
  ElMessage.error(res.data.msg);
  return;
 }
 })

}
}

//单删和批量删除
const AllDelete=()=>{
 
    var codee=listrow.value.map((row)=>row.examineId).toString();
   
   ElMessageBox.confirm(
    '确认删除吗?',
    '警告',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
      
        APIs.delete("/api/Write/AllDelete",{params:{textArray:codee}}).then(res=>{
    if(res.data.code==100)
 {
     ElMessage.success(res.data.msg);
       GetType();
 }
 else
 {
  ElMessage.error(res.data.msg);
  return;
 }
  })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消操作',
      })
    })


}
const Delete=(row:any)=>{

  ElMessageBox.confirm(
    '确认删除吗?',
    '警告',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
        APIs.delete("/api/Write/DeleteType",{params:{examineId:row.examineId}}).then(res=>{
    if(res.data.code==100)
 {
     ElMessage.success(res.data.msg);
       GetType();
 }
 else
 {
  ElMessage.error(res.data.msg);
  return;
 }
  })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消操作',
      })
    })


}

const tableData=ref<any>([])
const form=reactive({
  ExamineNo:"",
  ExamineName:""
})

const paing=reactive({
  PageIndex:1,
  PageSize:3,
  totalCount:0,
  total:1,

})
//是否显示查询条件
const GetOpen=(code:any)=>{
  
  if(code==false)
{
logic.isdisable=true;

}
 else 
{
  logic.isdisable=false;
}

}
//监听
watch(paing,()=>{
  GetType();
})
const GetType=()=>{
  APIs.get("/api/Read/GetExamineType",{
    params:{
       ExamineNo:form.ExamineNo,
       ExamineName:form.ExamineName,
       PageIndex:paing.PageIndex,
       PageSize:paing.PageSize
    }
  }).then(res=>{
    tableData.value=res.data.data.data;
    paing.totalCount=res.data.data.totalCount;
    paing.total=res.data.data.total;
  
  })
}
</script>